
    .v-binder-follower-container {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      height: 0;
      pointer-events: none;
      z-index: auto;
    }

    .v-binder-follower-content {
      position: absolute;
      z-index: auto;
    }

    .v-binder-follower-content>* {
      pointer-events: all;
    }

    .n-popover {

      transition:
        box-shadow .3s var(--n-bezier),
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier);
      position: relative;
      font-size: var(--n-font-size);
      color: var(--n-text-color);
      box-shadow: var(--n-box-shadow);
      word-break: break-word;

    }

    .n-popover>.n-scrollbar {

      height: inherit;
      max-height: inherit;

    }

    .n-popover:not(.n-popover--raw) {

      background-color: var(--n-color);
      border-radius: var(--n-border-radius);

    }

    .n-popover:not(.n-popover--raw):not(.n-popover--scrollable):not(.n-popover--show-header-or-footer) {
      padding: var(--n-padding);
    }

    .n-popover .n-popover__header {

      padding: var(--n-padding);
      border-bottom: 1px solid var(--n-divider-color);
      transition: border-color .3s var(--n-bezier);

    }

    .n-popover .n-popover__footer {

      padding: var(--n-padding);
      border-top: 1px solid var(--n-divider-color);
      transition: border-color .3s var(--n-bezier);

    }

    .n-popover.n-popover--scrollable .n-popover__content,
    .n-popover.n-popover--show-header-or-footer .n-popover__content {

      padding: var(--n-padding);

    }

    .n-popover-shared {

      transform-origin: inherit;

    }

    .n-popover-shared .n-popover-arrow-wrapper {

      position: absolute;
      overflow: hidden;
      pointer-events: none;

    }

    .n-popover-shared .n-popover-arrow-wrapper .n-popover-arrow {

      transition: background-color .3s var(--n-bezier);
      position: absolute;
      display: block;
      width: calc(var(--n-arrow-height) * 1.414);
      height: calc(var(--n-arrow-height) * 1.414);
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12);
      transform: rotate(45deg);
      background-color: var(--n-color);
      pointer-events: all;

    }

    .n-popover-shared.popover-transition-enter-from,
    .n-popover-shared.popover-transition-leave-to {

      opacity: 0;
      transform: scale(.85);

    }

    .n-popover-shared.popover-transition-enter-to,
    .n-popover-shared.popover-transition-leave-from {

      transform: scale(1);
      opacity: 1;

    }

    .n-popover-shared.popover-transition-enter-active {

      transition:
        box-shadow .3s var(--n-bezier),
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier),
        opacity .15s var(--n-bezier-ease-out),
        transform .15s var(--n-bezier-ease-out);

    }

    .n-popover-shared.popover-transition-leave-active {

      transition:
        box-shadow .3s var(--n-bezier),
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier),
        opacity .15s var(--n-bezier-ease-in),
        transform .15s var(--n-bezier-ease-in);

    }

    [v-placement="top-start"]>.n-popover-shared {

      margin-bottom: var(--n-space);

    }

    [v-placement="top-start"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-bottom: var(--n-space-arrow);

    }

    [v-placement="top-start"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="top-start"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      top: 100%;
      bottom: auto;
      height: var(--n-space-arrow);

    }

    [v-placement="top-start"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      top: calc(var(--n-arrow-height) * 1.414 / -2);
      left: calc(var(--n-arrow-offset) - var(--v-offset-left));

    }

    [v-placement="top"]>.n-popover-shared {

      margin-bottom: var(--n-space);

    }

    [v-placement="top"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-bottom: var(--n-space-arrow);

    }

    [v-placement="top"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="top"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      top: 100%;
      bottom: auto;
      height: var(--n-space-arrow);

    }

    [v-placement="top"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      top: calc(var(--n-arrow-height) * 1.414 / -2);
      transform: translateX(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
      left: 50%;

    }

    [v-placement="top-end"]>.n-popover-shared {

      margin-bottom: var(--n-space);

    }

    [v-placement="top-end"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-bottom: var(--n-space-arrow);

    }

    [v-placement="top-end"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="top-end"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      top: 100%;
      bottom: auto;
      height: var(--n-space-arrow);

    }

    [v-placement="top-end"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      top: calc(var(--n-arrow-height) * 1.414 / -2);
      right: calc(var(--n-arrow-offset) + var(--v-offset-left));

    }

    [v-placement="bottom-start"]>.n-popover-shared {

      margin-top: var(--n-space);

    }

    [v-placement="bottom-start"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-top: var(--n-space-arrow);

    }

    [v-placement="bottom-start"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="bottom-start"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      bottom: 100%;
      top: auto;
      height: var(--n-space-arrow);

    }

    [v-placement="bottom-start"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      bottom: calc(var(--n-arrow-height) * 1.414 / -2);
      left: calc(var(--n-arrow-offset) - var(--v-offset-left));

    }

    [v-placement="bottom"]>.n-popover-shared {

      margin-top: var(--n-space);

    }

    [v-placement="bottom"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-top: var(--n-space-arrow);

    }

    [v-placement="bottom"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="bottom"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      bottom: 100%;
      top: auto;
      height: var(--n-space-arrow);

    }

    [v-placement="bottom"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      bottom: calc(var(--n-arrow-height) * 1.414 / -2);
      transform: translateX(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
      left: 50%;

    }

    [v-placement="bottom-end"]>.n-popover-shared {

      margin-top: var(--n-space);

    }

    [v-placement="bottom-end"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-top: var(--n-space-arrow);

    }

    [v-placement="bottom-end"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="bottom-end"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      bottom: 100%;
      top: auto;
      height: var(--n-space-arrow);

    }

    [v-placement="bottom-end"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      bottom: calc(var(--n-arrow-height) * 1.414 / -2);
      right: calc(var(--n-arrow-offset) + var(--v-offset-left));

    }

    [v-placement="left-start"]>.n-popover-shared {

      margin-right: var(--n-space);

    }

    [v-placement="left-start"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-right: var(--n-space-arrow);

    }

    [v-placement="left-start"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="left-start"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      left: 100%;
      right: auto;
      width: var(--n-space-arrow);

    }

    [v-placement="left-start"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      left: calc(var(--n-arrow-height) * 1.414 / -2);
      top: calc(var(--n-arrow-offset-vertical) - var(--v-offset-top));

    }

    [v-placement="left"]>.n-popover-shared {

      margin-right: var(--n-space);

    }

    [v-placement="left"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-right: var(--n-space-arrow);

    }

    [v-placement="left"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="left"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      left: 100%;
      right: auto;
      width: var(--n-space-arrow);

    }

    [v-placement="left"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      left: calc(var(--n-arrow-height) * 1.414 / -2);
      transform: translateY(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
      top: 50%;

    }

    [v-placement="left-end"]>.n-popover-shared {

      margin-right: var(--n-space);

    }

    [v-placement="left-end"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-right: var(--n-space-arrow);

    }

    [v-placement="left-end"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="left-end"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      left: 100%;
      right: auto;
      width: var(--n-space-arrow);

    }

    [v-placement="left-end"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      left: calc(var(--n-arrow-height) * 1.414 / -2);
      bottom: calc(var(--n-arrow-offset-vertical) + var(--v-offset-top));

    }

    [v-placement="right-start"]>.n-popover-shared {

      margin-left: var(--n-space);

    }

    [v-placement="right-start"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-left: var(--n-space-arrow);

    }

    [v-placement="right-start"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="right-start"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      right: 100%;
      left: auto;
      width: var(--n-space-arrow);

    }

    [v-placement="right-start"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      right: calc(var(--n-arrow-height) * 1.414 / -2);
      top: calc(var(--n-arrow-offset-vertical) - var(--v-offset-top));

    }

    [v-placement="right"]>.n-popover-shared {

      margin-left: var(--n-space);

    }

    [v-placement="right"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-left: var(--n-space-arrow);

    }

    [v-placement="right"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="right"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      right: 100%;
      left: auto;
      width: var(--n-space-arrow);

    }

    [v-placement="right"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      right: calc(var(--n-arrow-height) * 1.414 / -2);
      transform: translateY(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
      top: 50%;

    }

    [v-placement="right-end"]>.n-popover-shared {

      margin-left: var(--n-space);

    }

    [v-placement="right-end"]>.n-popover-shared.n-popover-shared--show-arrow {

      margin-left: var(--n-space-arrow);

    }

    [v-placement="right-end"]>.n-popover-shared.n-popover-shared--overlap {

      margin: 0;

    }

    [v-placement="right-end"]>.n-popover-shared>.n-popover-arrow-wrapper {

      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      right: 100%;
      left: auto;
      width: var(--n-space-arrow);

    }

    [v-placement="right-end"]>.n-popover-shared>.n-popover-arrow-wrapper .n-popover-arrow {

      right: calc(var(--n-arrow-height) * 1.414 / -2);
      bottom: calc(var(--n-arrow-offset-vertical) + var(--v-offset-top));

    }

    [v-placement="right-start"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      top: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) - var(--v-offset-top));
    }

    [v-placement="left-start"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      top: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) - var(--v-offset-top));
    }

    [v-placement="top-end"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      right: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) + var(--v-offset-left));
    }

    [v-placement="bottom-end"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      right: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) + var(--v-offset-left));
    }

    [v-placement="right-end"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      bottom: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) + var(--v-offset-top));
    }

    [v-placement="left-end"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      bottom: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) + var(--v-offset-top));
    }

    [v-placement="top-start"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      left: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) - var(--v-offset-left));
    }

    [v-placement="bottom-start"]>.n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
      left: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) - var(--v-offset-left));
    }

    @keyframes badge-wave-spread {
      from {
        box-shadow: 0 0 0.5px 0px var(--n-ripple-color);
        opacity: 0.6;
      }

      to {
        box-shadow: 0 0 0.5px 4.5px var(--n-ripple-color);
        opacity: 0;
      }
    }

    .n-badge {

      display: inline-flex;
      position: relative;
      vertical-align: middle;
      font-family: var(--n-font-family);

    }

    .n-badge.n-badge--as-is .n-badge-sup {
      position: static;
      transform: translateX(0);
    }

    .n-badge.n-badge--as-is .n-badge-sup.fade-in-scale-up-transition-leave-active {
      transform-origin: left bottom;
      transition: opacity .2s cubic-bezier(.4, 0, 1, 1), transform .2s cubic-bezier(.4, 0, 1, 1);
    }

    .n-badge.n-badge--as-is .n-badge-sup.fade-in-scale-up-transition-enter-active {
      transform-origin: left bottom;
      transition: opacity .2s cubic-bezier(0, 0, .2, 1), transform .2s cubic-bezier(0, 0, .2, 1);
    }

    .n-badge.n-badge--as-is .n-badge-sup.fade-in-scale-up-transition-enter-from,
    .n-badge.n-badge--as-is .n-badge-sup.fade-in-scale-up-transition-leave-to {
      opacity: 0;
      transform: translateX(0) scale(.9);
    }

    .n-badge.n-badge--as-is .n-badge-sup.fade-in-scale-up-transition-leave-from,
    .n-badge.n-badge--as-is .n-badge-sup.fade-in-scale-up-transition-enter-to {
      opacity: 1;
      transform: translateX(0) scale(1);
    }

    .n-badge.n-badge--dot .n-badge-sup {

      height: 8px;
      width: 8px;
      padding: 0;
      min-width: 8px;
      left: 100%;
      bottom: calc(100% - 4px);

    }

    .n-badge.n-badge--dot .n-badge-sup ::before {
      border-radius: 4px;
    }

    .n-badge .n-badge-sup {

      background: var(--n-color);
      transition:
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier);
      color: #FFF;
      position: absolute;
      height: 18px;
      line-height: 18px;
      border-radius: 9px;
      padding: 0 6px;
      text-align: center;
      font-size: var(--n-font-size);
      transform: translateX(-50%);
      left: 100%;
      bottom: calc(100% - 9px);
      font-variant-numeric: tabular-nums;
      z-index: 2;
      display: flex;
      align-items: center;

    }

    .n-badge .n-badge-sup.fade-in-scale-up-transition-leave-active {
      transform-origin: left bottom;
      transition: opacity .2s cubic-bezier(.4, 0, 1, 1), transform .2s cubic-bezier(.4, 0, 1, 1);
    }

    .n-badge .n-badge-sup.fade-in-scale-up-transition-enter-active {
      transform-origin: left bottom;
      transition: opacity .2s cubic-bezier(0, 0, .2, 1), transform .2s cubic-bezier(0, 0, .2, 1);
    }

    .n-badge .n-badge-sup.fade-in-scale-up-transition-enter-from,
    .n-badge .n-badge-sup.fade-in-scale-up-transition-leave-to {
      opacity: 0;
      transform: translateX(-50%) scale(.9);
    }

    .n-badge .n-badge-sup.fade-in-scale-up-transition-leave-from,
    .n-badge .n-badge-sup.fade-in-scale-up-transition-enter-to {
      opacity: 1;
      transform: translateX(-50%) scale(1);
    }

    .n-badge .n-badge-sup .n-base-wave {
      z-index: 1;
      animation-duration: 2s;
      animation-iteration-count: infinite;
      animation-delay: 1s;
      animation-timing-function: var(--n-ripple-bezier);
      animation-name: badge-wave-spread;
    }

    .n-badge .n-badge-sup::before {

      opacity: 0;
      transform: scale(1);
      border-radius: 9px;
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;

    }

    .n-modal-container {

      position: fixed;
      left: 0;
      top: 0;
      height: 0;
      width: 0;
      display: flex;

    }

    .n-modal-mask {

      position: fixed;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      background-color: rgba(0, 0, 0, .4);

    }

    .n-modal-mask.fade-in-transition-enter-active {
      transition: all .25s var(--n-bezier-ease-out) !important;
    }

    .n-modal-mask.fade-in-transition-leave-active {
      transition: all .25s var(--n-bezier-ease-out) !important;
    }

    .n-modal-mask.fade-in-transition-enter-from,
    .n-modal-mask.fade-in-transition-leave-to {
      opacity: 0;
    }

    .n-modal-mask.fade-in-transition-leave-from,
    .n-modal-mask.fade-in-transition-enter-to {
      opacity: 1;
    }

    .n-modal-body-wrapper {

      position: fixed;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      overflow: visible;

    }

    .n-modal-body-wrapper .n-modal-scroll-content {

      min-height: 100%;
      display: flex;
      position: relative;

    }

    .n-modal {

      position: relative;
      align-self: center;
      color: var(--n-text-color);
      margin: auto;
      box-shadow: var(--n-box-shadow);

    }

    .n-modal.fade-in-scale-up-transition-leave-active {
      transform-origin: inherit;
      transition: opacity .25s cubic-bezier(.4, 0, 1, 1), transform .25s cubic-bezier(.4, 0, 1, 1);
    }

    .n-modal.fade-in-scale-up-transition-enter-active {
      transform-origin: inherit;
      transition: opacity .25s cubic-bezier(0, 0, .2, 1), transform .25s cubic-bezier(0, 0, .2, 1);
    }

    .n-modal.fade-in-scale-up-transition-enter-from,
    .n-modal.fade-in-scale-up-transition-leave-to {
      opacity: 0;
      transform: scale(.5);
    }

    .n-modal.fade-in-scale-up-transition-leave-from,
    .n-modal.fade-in-scale-up-transition-enter-to {
      opacity: 1;
      transform: scale(1);
    }

    .n-modal .n-draggable {

      cursor: move;
      user-select: none;

    }

    .n-drawer {

      word-break: break-word;
      line-height: var(--n-line-height);
      position: absolute;
      pointer-events: all;
      box-shadow: var(--n-box-shadow);
      transition:
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier);
      background-color: var(--n-color);
      color: var(--n-text-color);
      box-sizing: border-box;

    }

    .n-drawer.slide-in-from-right-transition-leave-active {
      transition: transform 0.2s cubic-bezier(.4, 0, 1, 1);
    }

    .n-drawer.slide-in-from-right-transition-enter-active {
      transition: transform 0.3s cubic-bezier(0, 0, .2, 1);
    }

    .n-drawer.slide-in-from-right-transition-enter-to {
      transform: translateX(0);
    }

    .n-drawer.slide-in-from-right-transition-enter-from {
      transform: translateX(100%);
    }

    .n-drawer.slide-in-from-right-transition-leave-from {
      transform: translateX(0);
    }

    .n-drawer.slide-in-from-right-transition-leave-to {
      transform: translateX(100%);
    }

    .n-drawer.slide-in-from-left-transition-leave-active {
      transition: transform 0.2s cubic-bezier(.4, 0, 1, 1);
    }

    .n-drawer.slide-in-from-left-transition-enter-active {
      transition: transform 0.3s cubic-bezier(0, 0, .2, 1);
    }

    .n-drawer.slide-in-from-left-transition-enter-to {
      transform: translateX(0);
    }

    .n-drawer.slide-in-from-left-transition-enter-from {
      transform: translateX(-100%);
    }

    .n-drawer.slide-in-from-left-transition-leave-from {
      transform: translateX(0);
    }

    .n-drawer.slide-in-from-left-transition-leave-to {
      transform: translateX(-100%);
    }

    .n-drawer.slide-in-from-top-transition-leave-active {
      transition: transform 0.2s cubic-bezier(.4, 0, 1, 1);
    }

    .n-drawer.slide-in-from-top-transition-enter-active {
      transition: transform 0.3s cubic-bezier(0, 0, .2, 1);
    }

    .n-drawer.slide-in-from-top-transition-enter-to {
      transform: translateY(0);
    }

    .n-drawer.slide-in-from-top-transition-enter-from {
      transform: translateY(-100%);
    }

    .n-drawer.slide-in-from-top-transition-leave-from {
      transform: translateY(0);
    }

    .n-drawer.slide-in-from-top-transition-leave-to {
      transform: translateY(-100%);
    }

    .n-drawer.slide-in-from-bottom-transition-leave-active {
      transition: transform 0.2s cubic-bezier(.4, 0, 1, 1);
    }

    .n-drawer.slide-in-from-bottom-transition-enter-active {
      transition: transform 0.3s cubic-bezier(0, 0, .2, 1);
    }

    .n-drawer.slide-in-from-bottom-transition-enter-to {
      transform: translateY(0);
    }

    .n-drawer.slide-in-from-bottom-transition-enter-from {
      transform: translateY(100%);
    }

    .n-drawer.slide-in-from-bottom-transition-leave-from {
      transform: translateY(0);
    }

    .n-drawer.slide-in-from-bottom-transition-leave-to {
      transform: translateY(100%);
    }

    .n-drawer.n-drawer--unselectable {

      user-select: none;
      -webkit-user-select: none;

    }

    .n-drawer.n-drawer--native-scrollbar .n-drawer-content-wrapper {

      overflow: auto;
      height: 100%;

    }

    .n-drawer .n-drawer__resize-trigger {

      position: absolute;
      background-color: #0000;
      transition: background-color .3s var(--n-bezier);

    }

    .n-drawer .n-drawer__resize-trigger.n-drawer__resize-trigger--hover {

      background-color: var(--n-resize-trigger-color-hover);

    }

    .n-drawer .n-drawer-content-wrapper {

      box-sizing: border-box;

    }

    .n-drawer .n-drawer-content {

      height: 100%;
      display: flex;
      flex-direction: column;

    }

    .n-drawer .n-drawer-content.n-drawer-content--native-scrollbar .n-drawer-body-content-wrapper {

      height: 100%;
      overflow: auto;

    }

    .n-drawer .n-drawer-content .n-drawer-body {

      flex: 1 0 0;
      overflow: hidden;

    }

    .n-drawer .n-drawer-content .n-drawer-body-content-wrapper {

      box-sizing: border-box;
      padding: var(--n-body-padding);

    }

    .n-drawer .n-drawer-content .n-drawer-header {

      font-weight: var(--n-title-font-weight);
      line-height: 1;
      font-size: var(--n-title-font-size);
      color: var(--n-title-text-color);
      padding: var(--n-header-padding);
      transition: border .3s var(--n-bezier);
      border-bottom: 1px solid var(--n-divider-color);
      border-bottom: var(--n-header-border-bottom);
      display: flex;
      justify-content: space-between;
      align-items: center;

    }

    .n-drawer .n-drawer-content .n-drawer-header .n-drawer-header__main {

      flex: 1;

    }

    .n-drawer .n-drawer-content .n-drawer-header .n-drawer-header__close {

      margin-left: 6px;
      transition:
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier);

    }

    .n-drawer .n-drawer-content .n-drawer-footer {

      display: flex;
      justify-content: flex-end;
      border-top: var(--n-footer-border-top);
      transition: border .3s var(--n-bezier);
      padding: var(--n-footer-padding);

    }

    .n-drawer.n-drawer--right-placement {

      top: 0;
      bottom: 0;
      right: 0;
      border-top-left-radius: var(--n-border-radius);
      border-bottom-left-radius: var(--n-border-radius);

    }

    .n-drawer.n-drawer--right-placement .n-drawer__resize-trigger {

      width: 3px;
      height: 100%;
      top: 0;
      left: 0;
      transform: translateX(-1.5px);
      cursor: ew-resize;

    }

    .n-drawer.n-drawer--left-placement {

      top: 0;
      bottom: 0;
      left: 0;
      border-top-right-radius: var(--n-border-radius);
      border-bottom-right-radius: var(--n-border-radius);

    }

    .n-drawer.n-drawer--left-placement .n-drawer__resize-trigger {

      width: 3px;
      height: 100%;
      top: 0;
      right: 0;
      transform: translateX(1.5px);
      cursor: ew-resize;

    }

    .n-drawer.n-drawer--top-placement {

      top: 0;
      left: 0;
      right: 0;
      border-bottom-left-radius: var(--n-border-radius);
      border-bottom-right-radius: var(--n-border-radius);

    }

    .n-drawer.n-drawer--top-placement .n-drawer__resize-trigger {

      width: 100%;
      height: 3px;
      bottom: 0;
      left: 0;
      transform: translateY(1.5px);
      cursor: ns-resize;

    }

    .n-drawer.n-drawer--bottom-placement {

      left: 0;
      bottom: 0;
      right: 0;
      border-top-left-radius: var(--n-border-radius);
      border-top-right-radius: var(--n-border-radius);

    }

    .n-drawer.n-drawer--bottom-placement .n-drawer__resize-trigger {

      width: 100%;
      height: 3px;
      top: 0;
      left: 0;
      transform: translateY(-1.5px);
      cursor: ns-resize;

    }

    body>.n-drawer-container {

      position: fixed;

    }

    .n-drawer-container {

      position: relative;
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      pointer-events: none;

    }

    .n-drawer-container>* {

      pointer-events: all;

    }

    .n-drawer-mask {

      background-color: rgba(0, 0, 0, .3);
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;

    }

    .n-drawer-mask.n-drawer-mask--invisible {

      background-color: rgba(0, 0, 0, 0)
    }

    .n-drawer-mask.fade-in-transition-enter-active {
      transition: all 0.2s var(--n-bezier-in) !important;
    }

    .n-drawer-mask.fade-in-transition-leave-active {
      transition: all 0.2s var(--n-bezier-out) !important;
    }

    .n-drawer-mask.fade-in-transition-enter-from,
    .n-drawer-mask.fade-in-transition-leave-to {
      opacity: 0;
    }

    .n-drawer-mask.fade-in-transition-leave-from,
    .n-drawer-mask.fade-in-transition-enter-to {
      opacity: 1;
    }

    .n-base-wave {

      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      border-radius: inherit;

    }

    .n-icon {

      height: 1em;
      width: 1em;
      line-height: 1em;
      text-align: center;
      display: inline-block;
      position: relative;
      fill: currentColor;
      transform: translateZ(0);

    }

    .n-icon.n-icon--color-transition {
      transition: color .3s var(--n-bezier);
    }

    .n-icon.n-icon--depth {
      color: var(--n-color);
    }

    .n-icon.n-icon--depth svg {
      opacity: var(--n-opacity);
      transition: opacity .3s var(--n-bezier);
    }

    .n-icon svg {
      height: 1em;
      width: 1em;
    }

    .n-button {

      margin: 0;
      font-weight: var(--n-font-weight);
      line-height: 1;
      font-family: inherit;
      padding: var(--n-padding);
      height: var(--n-height);
      font-size: var(--n-font-size);
      border-radius: var(--n-border-radius);
      color: var(--n-text-color);
      background-color: var(--n-color);
      width: var(--n-width);
      white-space: nowrap;
      outline: none;
      position: relative;
      z-index: auto;
      border: none;
      display: inline-flex;
      flex-wrap: nowrap;
      flex-shrink: 0;
      align-items: center;
      justify-content: center;
      user-select: none;
      -webkit-user-select: none;
      text-align: center;
      cursor: pointer;
      text-decoration: none;
      transition:
        color .3s var(--n-bezier),
        background-color .3s var(--n-bezier),
        opacity .3s var(--n-bezier),
        border-color .3s var(--n-bezier);

    }

    .n-button.n-button--color .n-button__border {
      border-color: var(--n-border-color);
    }

    .n-button.n-button--color.n-button--disabled .n-button__border {
      border-color: var(--n-border-color-disabled);
    }

    .n-button.n-button--color:not(.n-button--disabled):focus .n-button__state-border {
      border-color: var(--n-border-color-focus);
    }

    .n-button.n-button--color:not(.n-button--disabled):hover .n-button__state-border {
      border-color: var(--n-border-color-hover);
    }

    .n-button.n-button--color:not(.n-button--disabled):active .n-button__state-border {
      border-color: var(--n-border-color-pressed);
    }

    .n-button.n-button--color:not(.n-button--disabled).n-button--pressed .n-button__state-border {
      border-color: var(--n-border-color-pressed);
    }

    .n-button.n-button--disabled {
      background-color: var(--n-color-disabled);
      color: var(--n-text-color-disabled);
    }

    .n-button.n-button--disabled .n-button__border {
      border: var(--n-border-disabled);
    }

    .n-button:not(.n-button--disabled):focus {
      background-color: var(--n-color-focus);
      color: var(--n-text-color-focus);
    }

    .n-button:not(.n-button--disabled):focus .n-button__state-border {
      border: var(--n-border-focus);
    }

    .n-button:not(.n-button--disabled):hover {
      background-color: var(--n-color-hover);
      color: var(--n-text-color-hover);
    }

    .n-button:not(.n-button--disabled):hover .n-button__state-border {
      border: var(--n-border-hover);
    }

    .n-button:not(.n-button--disabled):active {
      background-color: var(--n-color-pressed);
      color: var(--n-text-color-pressed);
    }

    .n-button:not(.n-button--disabled):active .n-button__state-border {
      border: var(--n-border-pressed);
    }

    .n-button:not(.n-button--disabled).n-button--pressed {
      background-color: var(--n-color-pressed);
      color: var(--n-text-color-pressed);
    }

    .n-button:not(.n-button--disabled).n-button--pressed .n-button__state-border {
      border: var(--n-border-pressed);
    }

    .n-button.n-button--loading {
      cursor: wait;
    }

    .n-button .n-base-wave {

      pointer-events: none;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      animation-iteration-count: 1;
      animation-duration: var(--n-ripple-duration);
      animation-timing-function: var(--n-bezier-ease-out), var(--n-bezier-ease-out);

    }

    .n-button .n-base-wave.n-base-wave--active {
      z-index: 1;
      animation-name: button-wave-spread, button-wave-opacity;
    }

    .n-button .n-button__border,
    .n-button .n-button__state-border {

      position: absolute;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      border-radius: inherit;
      transition: border-color .3s var(--n-bezier);
      pointer-events: none;

    }

    .n-button .n-button__border {
      border: var(--n-border);
    }

    .n-button .n-button__state-border {
      border: var(--n-border);
      border-color: #0000;
      z-index: 1;
    }

    .n-button .n-button__icon {

      margin: var(--n-icon-margin);
      margin-left: 0;
      height: var(--n-icon-size);
      width: var(--n-icon-size);
      max-width: var(--n-icon-size);
      font-size: var(--n-icon-size);
      position: relative;
      flex-shrink: 0;

    }

    .n-button .n-button__icon .n-icon-slot {

      height: var(--n-icon-size);
      width: var(--n-icon-size);
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      display: flex;
      align-items: center;
      justify-content: center;

    }

    .n-button .n-button__icon .n-icon-slot.icon-switch-transition-enter-from,
    .n-button .n-button__icon .n-icon-slot.icon-switch-transition-leave-to {
      transform: translateY(-50%) scale(0.75);
      left: 0;
      top: 50%;
      opacity: 0;
    }

    .n-button .n-button__icon .n-icon-slot.icon-switch-transition-enter-to,
    .n-button .n-button__icon .n-icon-slot.icon-switch-transition-leave-from {
      transform: scale(1) translateY(-50%);
      left: 0;
      top: 50%;
      opacity: 1;
    }

    .n-button .n-button__icon .n-icon-slot.icon-switch-transition-enter-active,
    .n-button .n-button__icon .n-icon-slot.icon-switch-transition-leave-active {
      transform-origin: center;
      position: absolute;
      left: 0;
      top: 50%;
      transition: all .3s cubic-bezier(.4, 0, .2, 1) !important;
    }

    .n-button .n-button__icon.fade-in-width-expand-transition-leave-from,
    .n-button .n-button__icon.fade-in-width-expand-transition-enter-to {
      opacity: 1;
    }

    .n-button .n-button__icon.fade-in-width-expand-transition-leave-to,
    .n-button .n-button__icon.fade-in-width-expand-transition-enter-from {

      opacity: 0 !important;
      margin-left: 0 !important;
      margin-right: 0 !important;

    }

    .n-button .n-button__icon.fade-in-width-expand-transition-leave-active {

      overflow: hidden;
      transition:
        opacity .2s cubic-bezier(.4, 0, .2, 1),
        max-width .2s cubic-bezier(.4, 0, .2, 1) .1s,
        margin-left .2s cubic-bezier(.4, 0, .2, 1) .1s,
        margin-right .2s cubic-bezier(.4, 0, .2, 1) .1s;

    }

    .n-button .n-button__icon.fade-in-width-expand-transition-enter-active {

      overflow: hidden;
      transition:
        opacity .2s cubic-bezier(.4, 0, .2, 1) .1s,
        max-width .2s cubic-bezier(.4, 0, .2, 1),
        margin-left .2s cubic-bezier(.4, 0, .2, 1),
        margin-right .2s cubic-bezier(.4, 0, .2, 1);

    }

    .n-button .n-button__content {

      display: flex;
      align-items: center;
      flex-wrap: nowrap;
      min-width: 0;

    }

    .n-button .n-button__content~.n-button__icon {
      margin: var(--n-icon-margin);
      margin-right: 0;
    }

    .n-button.n-button--block {

      display: flex;
      width: 100%;

    }

    .n-button.n-button--dashed .n-button__border,
    .n-button.n-button--dashed .n-button__state-border {
      border-style: dashed !important;
    }

    .n-button.n-button--disabled {
      cursor: not-allowed;
      opacity: var(--n-opacity-disabled);
    }

    @keyframes button-wave-spread {
      from {
        box-shadow: 0 0 0.5px 0 var(--n-ripple-color);
      }

      to {
        box-shadow: 0 0 0.5px 4.5px var(--n-ripple-color);
      }
    }

    @keyframes button-wave-opacity {
      from {
        opacity: var(--n-wave-opacity);
      }

      to {
        opacity: 0;
      }
    }

    .n-layout-header {

      transition:
        color .3s var(--n-bezier),
        background-color .3s var(--n-bezier),
        box-shadow .3s var(--n-bezier),
        border-color .3s var(--n-bezier);
      box-sizing: border-box;
      width: 100%;
      background-color: var(--n-color);
      color: var(--n-text-color);

    }

    .n-layout-header.n-layout-header--absolute-positioned {

      position: absolute;
      left: 0;
      right: 0;
      top: 0;

    }

    .n-layout-header.n-layout-header--bordered {

      border-bottom: solid 1px var(--n-border-color);

    }

    .n-layout {

      color: var(--n-text-color);
      background-color: var(--n-color);
      box-sizing: border-box;
      position: relative;
      z-index: auto;
      flex: auto;
      overflow: hidden;
      transition:
        box-shadow .3s var(--n-bezier),
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier);

    }

    .n-layout .n-layout-scroll-container {

      overflow-x: hidden;
      box-sizing: border-box;
      height: 100%;

    }

    .n-layout.n-layout--absolute-positioned {

      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;

    }

    @keyframes rotator {

      0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
      }

      100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
      }
    }

    .n-base-loading {

      position: relative;
      line-height: 0;
      width: 1em;
      height: 1em;

    }

    .n-base-loading .n-base-loading__transition-wrapper {

      position: absolute;
      width: 100%;
      height: 100%;

    }

    .n-base-loading .n-base-loading__transition-wrapper.icon-switch-transition-enter-from,
    .n-base-loading .n-base-loading__transition-wrapper.icon-switch-transition-leave-to {
      transform: scale(0.75);
      left: 0;
      top: 0;
      opacity: 0;
    }

    .n-base-loading .n-base-loading__transition-wrapper.icon-switch-transition-enter-to,
    .n-base-loading .n-base-loading__transition-wrapper.icon-switch-transition-leave-from {
      transform: scale(1);
      left: 0;
      top: 0;
      opacity: 1;
    }

    .n-base-loading .n-base-loading__transition-wrapper.icon-switch-transition-enter-active,
    .n-base-loading .n-base-loading__transition-wrapper.icon-switch-transition-leave-active {
      transform-origin: center;
      position: absolute;
      left: 0;
      top: 0;
      transition: all .3s cubic-bezier(.4, 0, .2, 1) !important;
    }

    .n-base-loading .n-base-loading__placeholder {

      position: absolute;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);

    }

    .n-base-loading .n-base-loading__placeholder.icon-switch-transition-enter-from,
    .n-base-loading .n-base-loading__placeholder.icon-switch-transition-leave-to {
      transform: translateX(-50%) translateY(-50%) scale(0.75);
      left: 50%;
      top: 50%;
      opacity: 0;
    }

    .n-base-loading .n-base-loading__placeholder.icon-switch-transition-enter-to,
    .n-base-loading .n-base-loading__placeholder.icon-switch-transition-leave-from {
      transform: scale(1) translateX(-50%) translateY(-50%);
      left: 50%;
      top: 50%;
      opacity: 1;
    }

    .n-base-loading .n-base-loading__placeholder.icon-switch-transition-enter-active,
    .n-base-loading .n-base-loading__placeholder.icon-switch-transition-leave-active {
      transform-origin: center;
      position: absolute;
      left: 50%;
      top: 50%;
      transition: all .3s cubic-bezier(.4, 0, .2, 1) !important;
    }

    .n-base-loading .n-base-loading__container {

      animation: rotator 3s linear infinite both;

    }

    .n-base-loading .n-base-loading__container .n-base-loading__icon {

      height: 1em;
      width: 1em;

    }

    @keyframes spin-rotate {

      from {
        transform: rotate(0);
      }

      to {
        transform: rotate(360deg);
      }

    }

    .n-spin-container {

      position: relative;

    }

    .n-spin-container .n-spin-body {

      position: absolute;
      top: 50%;
      left: 50%;
      transform: translateX(-50%) translateY(-50%);

    }

    .n-spin-container .n-spin-body.fade-in-transition-enter-active {
      transition: all 0.2s cubic-bezier(.4, 0, .2, 1) !important;
    }

    .n-spin-container .n-spin-body.fade-in-transition-leave-active {
      transition: all 0.2s cubic-bezier(.4, 0, .2, 1) !important;
    }

    .n-spin-container .n-spin-body.fade-in-transition-enter-from,
    .n-spin-container .n-spin-body.fade-in-transition-leave-to {
      opacity: 0;
    }

    .n-spin-container .n-spin-body.fade-in-transition-leave-from,
    .n-spin-container .n-spin-body.fade-in-transition-enter-to {
      opacity: 1;
    }

    .n-spin-body {

      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;

    }

    .n-spin {

      display: inline-flex;
      height: var(--n-size);
      width: var(--n-size);
      font-size: var(--n-size);
      color: var(--n-color);

    }

    .n-spin.n-spin--rotate {

      animation: spin-rotate 2s linear infinite;

    }

    .n-spin-description {

      display: inline-block;
      font-size: var(--n-font-size);
      color: var(--n-text-color);
      transition: color .3s var(--n-bezier);
      margin-top: 8px;

    }

    .n-spin-content {

      opacity: 1;
      transition: opacity .3s var(--n-bezier);
      pointer-events: all;

    }

    .n-spin-content.n-spin-content--spinning {

      user-select: none;
      -webkit-user-select: none;
      pointer-events: none;
      opacity: var(--n-opacity-spinning);

    }

    body {

      margin: 0;
      font-size: 14px;
      font-family: v-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      line-height: 1.6;
      -webkit-text-size-adjust: 100%;
      -webkit-tap-highlight-color: transparent;

    }

    body input {

      font-family: inherit;
      font-size: inherit;

    }

    .n-notification-container {

      z-index: 4000;
      position: fixed;
      overflow: visible;
      display: flex;
      flex-direction: column;
      align-items: flex-end;

    }

    .n-notification-container>.n-scrollbar {

      width: initial;
      overflow: visible;
      height: -moz-fit-content !important;
      height: fit-content !important;
      max-height: 100vh !important;

    }

    .n-notification-container>.n-scrollbar>.n-scrollbar-container {

      height: -moz-fit-content !important;
      height: fit-content !important;
      max-height: 100vh !important;

    }

    .n-notification-container>.n-scrollbar>.n-scrollbar-container .n-scrollbar-content {

      padding-top: 12px;
      padding-bottom: 33px;

    }

    .n-notification-container.n-notification-container--top,
    .n-notification-container.n-notification-container--top-right,
    .n-notification-container.n-notification-container--top-left {

      top: 12px;

    }

    .n-notification-container.n-notification-container--top.transitioning>.n-scrollbar>.n-scrollbar-container,
    .n-notification-container.n-notification-container--top-right.transitioning>.n-scrollbar>.n-scrollbar-container,
    .n-notification-container.n-notification-container--top-left.transitioning>.n-scrollbar>.n-scrollbar-container {

      min-height: 100vh !important;

    }

    .n-notification-container.n-notification-container--bottom,
    .n-notification-container.n-notification-container--bottom-right,
    .n-notification-container.n-notification-container--bottom-left {

      bottom: 12px;

    }

    .n-notification-container.n-notification-container--bottom>.n-scrollbar>.n-scrollbar-container .n-scrollbar-content,
    .n-notification-container.n-notification-container--bottom-right>.n-scrollbar>.n-scrollbar-container .n-scrollbar-content,
    .n-notification-container.n-notification-container--bottom-left>.n-scrollbar>.n-scrollbar-container .n-scrollbar-content {

      padding-bottom: 12px;

    }

    .n-notification-container.n-notification-container--bottom .n-notification-wrapper,
    .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper,
    .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper {

      display: flex;
      align-items: flex-end;
      margin-bottom: 0;
      margin-top: 12px;

    }

    .n-notification-container.n-notification-container--top,
    .n-notification-container.n-notification-container--bottom {

      left: 50%;
      transform: translateX(-50%);

    }

    .n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-enter-from,
    .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-enter-from,
    .n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-leave-to,
    .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-leave-to {

      transform: scale(0.85);

    }

    .n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-leave-from,
    .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-leave-from,
    .n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-enter-to,
    .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-enter-to {

      transform: scale(1);

    }

    .n-notification-container.n-notification-container--top .n-notification-wrapper {

      transform-origin: top center;

    }

    .n-notification-container.n-notification-container--bottom .n-notification-wrapper {

      transform-origin: bottom center;

    }

    .n-notification-container.n-notification-container--top-right .n-notification,
    .n-notification-container.n-notification-container--bottom-right .n-notification {

      margin-left: 28px;
      margin-right: 16px;

    }

    .n-notification-container.n-notification-container--top-left .n-notification,
    .n-notification-container.n-notification-container--bottom-left .n-notification {

      margin-left: 16px;
      margin-right: 28px;

    }

    .n-notification-container.n-notification-container--top-right {

      right: 0;

    }

    .n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-enter-from,
    .n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-leave-to {

      transform: translate(calc(100%), 0);

    }

    .n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-leave-from,
    .n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-enter-to {

      transform: translate(0, 0);

    }

    .n-notification-container.n-notification-container--top-left {

      left: 0;

    }

    .n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-enter-from,
    .n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-leave-to {

      transform: translate(calc(-100%), 0);

    }

    .n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-leave-from,
    .n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-enter-to {

      transform: translate(0, 0);

    }

    .n-notification-container.n-notification-container--bottom-right {

      right: 0;

    }

    .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-enter-from,
    .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-leave-to {

      transform: translate(calc(100%), 0);

    }

    .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-leave-from,
    .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-enter-to {

      transform: translate(0, 0);

    }

    .n-notification-container.n-notification-container--bottom-left {

      left: 0;

    }

    .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-enter-from,
    .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-leave-to {

      transform: translate(calc(-100%), 0);

    }

    .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-leave-from,
    .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-enter-to {

      transform: translate(0, 0);

    }

    .n-notification-container.n-notification-container--scrollable.n-notification-container--top-right {

      top: 0;

    }

    .n-notification-container.n-notification-container--scrollable.n-notification-container--top-left {

      top: 0;

    }

    .n-notification-container.n-notification-container--scrollable.n-notification-container--bottom-right {

      bottom: 0;

    }

    .n-notification-container.n-notification-container--scrollable.n-notification-container--bottom-left {

      bottom: 0;

    }

    .n-notification-container .n-notification-wrapper {

      margin-bottom: 12px;

    }

    .n-notification-container .n-notification-wrapper.notification-transition-enter-from,
    .n-notification-container .n-notification-wrapper.notification-transition-leave-to {

      opacity: 0;
      margin-top: 0 !important;
      margin-bottom: 0 !important;

    }

    .n-notification-container .n-notification-wrapper.notification-transition-leave-from,
    .n-notification-container .n-notification-wrapper.notification-transition-enter-to {

      opacity: 1;

    }

    .n-notification-container .n-notification-wrapper.notification-transition-leave-active {

      transition:
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier),
        opacity .3s var(--n-bezier),
        transform .3s var(--n-bezier-ease-in),
        max-height .3s var(--n-bezier),
        margin-top .3s linear,
        margin-bottom .3s linear,
        box-shadow .3s var(--n-bezier);

    }

    .n-notification-container .n-notification-wrapper.notification-transition-enter-active {

      transition:
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier),
        opacity .3s var(--n-bezier),
        transform .3s var(--n-bezier-ease-out),
        max-height .3s var(--n-bezier),
        margin-top .3s linear,
        margin-bottom .3s linear,
        box-shadow .3s var(--n-bezier);

    }

    .n-notification-container .n-notification {

      background-color: var(--n-color);
      color: var(--n-text-color);
      transition:
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier),
        opacity .3s var(--n-bezier),
        box-shadow .3s var(--n-bezier);
      font-family: inherit;
      font-size: var(--n-font-size);
      font-weight: 400;
      position: relative;
      display: flex;
      overflow: hidden;
      flex-shrink: 0;
      padding-left: var(--n-padding-left);
      padding-right: var(--n-padding-right);
      width: var(--n-width);
      max-width: calc(100vw - 16px - 16px);
      border-radius: var(--n-border-radius);
      box-shadow: var(--n-box-shadow);
      box-sizing: border-box;
      opacity: 1;

    }

    .n-notification-container .n-notification .n-notification__avatar .n-icon {

      color: var(--n-icon-color);

    }

    .n-notification-container .n-notification .n-notification__avatar .n-base-icon {

      color: var(--n-icon-color);

    }

    .n-notification-container .n-notification.n-notification--show-avatar .n-notification-main {

      margin-left: 40px;
      width: calc(100% - 40px);

    }

    .n-notification-container .n-notification.n-notification--closable .n-notification-main>*:first-child {

      padding-right: 20px;

    }

    .n-notification-container .n-notification.n-notification--closable .n-notification__close {

      position: absolute;
      top: 0;
      right: 0;
      margin: var(--n-close-margin);
      transition:
        background-color .3s var(--n-bezier),
        color .3s var(--n-bezier);

    }

    .n-notification-container .n-notification .n-notification__avatar {

      position: absolute;
      top: var(--n-padding-top);
      left: var(--n-padding-left);
      width: 28px;
      height: 28px;
      font-size: 28px;
      display: flex;
      align-items: center;
      justify-content: center;

    }

    .n-notification-container .n-notification .n-notification__avatar .n-icon {
      transition: color .3s var(--n-bezier);
    }

    .n-notification-container .n-notification .n-notification-main {

      padding-top: var(--n-padding-top);
      padding-bottom: var(--n-padding-bottom);
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      margin-left: 8px;
      width: calc(100% - 8px);

    }

    .n-notification-container .n-notification .n-notification-main .n-notification-main-footer {

      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: 12px;

    }

    .n-notification-container .n-notification .n-notification-main .n-notification-main-footer .n-notification-main-footer__meta {

      font-size: var(--n-meta-font-size);
      transition: color .3s var(--n-bezier-ease-out);
      color: var(--n-description-text-color);

    }

    .n-notification-container .n-notification .n-notification-main .n-notification-main-footer .n-notification-main-footer__action {

      cursor: pointer;
      transition: color .3s var(--n-bezier-ease-out);
      color: var(--n-action-text-color);

    }

    .n-notification-container .n-notification .n-notification-main .n-notification-main__header {

      font-weight: var(--n-title-font-weight);
      font-size: var(--n-title-font-size);
      transition: color .3s var(--n-bezier-ease-out);
      color: var(--n-title-text-color);

    }

    .n-notification-container .n-notification .n-notification-main .n-notification-main__description {

      margin-top: 8px;
      font-size: var(--n-description-font-size);
      white-space: pre-wrap;
      word-wrap: break-word;
      transition: color .3s var(--n-bezier-ease-out);
      color: var(--n-description-text-color);

    }

    .n-notification-container .n-notification .n-notification-main .n-notification-main__content {

      line-height: var(--n-line-height);
      margin: 12px 0 0 0;
      font-family: inherit;
      white-space: pre-wrap;
      word-wrap: break-word;
      transition: color .3s var(--n-bezier-ease-out);
      color: var(--n-text-color);

    }

    .n-notification-container .n-notification .n-notification-main .n-notification-main__content:first-child {
      margin: 0;
    }